<style scoped>
  .weui-form-preview__hd label, .weui-form-preview__hd em {
    font-size: .9em !important;
  }
  .weui-loadmore_line .weui-loadmore__tips {
    background-color: #eee;
  }
  .rj-cell.max span{
    font-size: 16px;
    padding-right: 20px;
  }
  .rj-cell label {
    color: #333;
    font-size: 14px;
    width: 44%;
    display: inline-block;
    padding: 5px 3%;
    text-align: right;
  }
  .rj-cell span {
    font-size: 14px;
    color: #333;
    display: inline-block;
    width: 50%;
  }
  .rj-cell.note label{
    float: left;
  }
  .rj-cell.note span{
    width: 80%;
    display: inline-block;
  }
  .weui-cells {
    margin-top: 0;
  }
  .weui-cells_form {
    background: #fbfbfb;
  }
  .weui-cell {
    background: #fff;
  }
  .weui-cells__title {
    text-align: left;
  }
  .oitem {
    padding: 3px;
  }
  .hide {
    display: none;
  }
  #acts {
    font-size: 0;
  }
  #acts span {
    font-size: 14px;
  }
  .halfbtn {
    display: inline-block;
    width: 49%;
  }
  .weui-label {
    text-align: left;
  }
  .weui_cell {
    padding: 10px 15px;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background: #fff;
  }
  .weui-cell_select {
    padding: 0 15px;
  }


  .weui-panel {
    background: #eee;
  }

  .rj-cont-tit {
    margin: 0;
    border-radius: 0;
  }

  .weui-panel {
    margin-top: 0;
    text-align: left;
  }

  .hd .weui-grid.js_grid {
    font-weight: 600;
  }

  .weui-grid.js_grid {
    width: 25%;
    padding: 10px 1px;
  }

  /*.weui-grid.fir {*/
  /*  width: 20%;*/
  /*}*/
  /*.weui-grid.sec {*/
  /*  width: 15%;*/
  /*}*/
  /*.weui-grid.thr {*/
  /*  width: 20%;*/
  /*}*/
  /*.weui-grid.fou {*/
  /*  width: 15%;*/
  /*}*/
  /*.weui-grid.fiv {*/
  /*  width: 15%;*/
  /*}*/
  .weui-grid__label {
    text-overflow: initial;
  }
  .section {
    margin: 5px;
    border-radius: 5px;
    position: relative;
  }


  .weui_uploader_input_wrp {
    float: left;
    position: relative;
    margin-right: 9px;
    margin-bottom: 9px;
    width: 77px;
    height: 77px;
    border: 1px solid #D9D9D9;
  }

  .weui_uploader_hd {
    padding-top: 0;
    padding-right: 0;
    padding-left: 0;
  }

  .weui_uploader_files {
    list-style: none;
  }

  .weui_uploader_input_wrp:before {
    width: 2px;
    height: 39.5px;
  }

  .weui_uploader_input_wrp:before, .weui_uploader_input_wrp:after {
    content: " ";
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background-color: #D9D9D9;
  }

  .weui_uploader_input {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }

  .weui_uploader_input_wrp:after {
    width: 39.5px;
    height: 2px;
  }

  .weui_uploader_bd {
    overflow: hidden;
  }

  .weui_cell {
    padding: 10px 15px;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
  }

  .weui-cell.fir {
    border-top: 0;
  }

  .help {
    text-align: right;
    padding: 5px;
    font-size: 12px;
    color: #bbb;
  }

  .weui_uploader_input_wrp.inrow {
    width: 30px;
    height: 30px;
    margin: 0;
  }

  .weui_uploader_input_wrp:before {
    height: 19.5px;
  }

  .weui_uploader_input_wrp:after {
    width: 19.5px;
  }

  .weui-uploader_file.inrow {
    margin: 0;
    width: 40px;
  }

  ul#images {
    text-align: right;
  }

  .itembtn {
    position: absolute;
    right: 6px;
    top: 2px;
    z-index: 1;
    font-size: 12px;
    color: #04BE02;
    cursor: pointer;
  }
</style>
<template>
  <div class="examine" style="background: #eee;">
    <div class="rj-wrap" style="background: #fff;">
      {{title}}
      <a href="javascript:;" @click="$router.back(-1)" style="position: absolute; left: 10px; top: 8px">
        <img src="@/assets/back.png" style="width: 20px" />
      </a>
    </div>
    <!--    主表信息-->
    <div class="weui-form-preview section" style="background: #fff;">
      <div class="weui-form-preview__hd">
        <label class="weui-form-preview__label">编号</label>
        <em class="weui-form-preview__value">{{baseInfo.code}}</em>
      </div>
      <div class="weui-form-preview__bd">
        <div class="weui-form-preview__item">
          <label class="weui-form-preview__label">采购日期</label>
          <span class="weui-form-preview__value">{{baseInfo.purchdate}}</span>
        </div>
        <div class="weui-form-preview__item">
          <label class="weui-form-preview__label">入库库房</label>
          <span class="weui-form-preview__value">{{baseInfo.srname}}</span>
        </div>
        <div class="weui-form-preview__item">
          <label class="weui-form-preview__label">采购部门</label>
          <span class="weui-form-preview__value">{{baseInfo.department}}</span>
        </div>
        <div class="weui-form-preview__item">
          <label class="weui-form-preview__label">供应商</label>
          <span class="weui-form-preview__value">{{baseInfo.supplier}}</span>
        </div>
        <div class="weui-form-preview__item">
          <label class="weui-form-preview__label">状态</label>
          <span class="weui-form-preview__value">{{baseInfo.statusname}}</span>
        </div>
        <div class="weui-form-preview__item">
          <label class="weui-form-preview__label">备注</label>
          <span class="weui-form-preview__value">{{baseInfo.remark}}</span>
        </div>
        <div class="weui-form-preview__item">
          <label class="weui-form-preview__label">操作人</label>
          <span class="weui-form-preview__value">{{baseInfo.operator}}</span>
        </div>
        <div class="weui-form-preview__item">
          <label class="weui-form-preview__label">创建时间</label>
          <span class="weui-form-preview__value">{{baseInfo.createtime}}</span>
        </div>
        <div class="weui-form-preview__item" v-if="baseInfo.files && baseInfo.files.length > 0">
          <label class="weui-form-preview__label">附件</label>
          <a v-for="(item, index) in baseInfo.files" :href="item.url">
            <span class="weui-form-preview__value">{{item.imagename}}</span>
          </a>
        </div>
      </div>
    </div>
    <!--    明细信息-->
    <div class="weui-panel__hd" style="text-align: left;">货品明细</div>
    <!--    <div class="weui-panel__bd" style="background: #fff;">-->

    <div class="section" v-for="(product, index) in baseInfo.items" :key="product.guid">
      <input type="hidden" :name="'whinitems[' + index + '].applyitemid'" :value="product.guid" />
      <input type="hidden" :name="'whinitems[' + index + '].productguid'" :value="product.productguid" />
      <input type="hidden" :name="'whinitems[' + index + '].spguid'" :value="product.spguid" />
      <!--        <div class="weui-cells__title">货品明细 {{index + 1}}</div>-->
      <p v-if="baseInfo.items.length > 1" class="itembtn" @click="delItem(product.guid)">删除</p>
      <div class="weui-cell fir">
        <div class="weui-cell__hd"><label class="weui-label">产品</label></div>
        <div class="weui-cell__bd">
          <input class="weui-input" type="text" name="" readonly="true" :value="product.productname">
        </div>
      </div>
      <div class="weui-cell">
        <div class="weui-cell__hd"><label class="weui-label">规格</label></div>
        <div class="weui-cell__bd">
          <input class="weui-input" type="text" name="" readonly="true" :value="product.spname">
        </div>
      </div>
      <div class="weui-cell">
        <div class="weui-cell__hd"><label class="weui-label">库间</label></div>
        <div class="weui-cell__bd">
          <select class="weui-select house" v-model="baseInfo.items[index].shrguid">
            <option value="" disabled>请选择</option>
            <option v-for="(item, i) in autoHouses(index)" :key="item.guid" :value="item.guid">{{item.name}}</option>
          </select>
        </div>
      </div>
      <div class="weui-cell">
        <div class="weui-cell__hd"><label class="weui-label">数量{{product.stockunit ? `(${product.stockunit})` : ''}}</label></div>
        <div class="weui-cell__bd">
          <input class="weui-input count" type="number" :name="'whinitems[' + index + '].weight'" readonly v-model="baseInfo.items[index].count" placeholder="请输入数量">
        </div>
      </div>
      <!--      </div>-->
    </div>
    <!--    动态数据-->
    <p style="height: 5px;"></p>
    <div class="weui-cells weui-cells_form section">
      <form action="" method="post" id="formid">
        <div class="weui-cell fir">
          <div class="weui-cell__hd"><label class="weui-label">附件上传</label></div>
          <div class="weui-cell__ft">
            <div class="weui_uploader_bd">
              <ul class="weui_uploader_files"></ul>
              <div class="weui_uploader_input_wrp inrow">
                <UploadFile3 class="weui_uploader_input" v-on:pushfile="setFile"></UploadFile3>
              </div>
            </div>
          </div>
          <ul class="weui-uploader_files" id="images">
            <li class="weui-uploader_file" v-for="(fil, index) in filenames" @click=delFile(fil,fileids[index])>
              {{fil}}
            </li>
          </ul>
        </div>
        <div class="weui-cell">
          <div class="weui-cell__bd">
            <textarea class="weui-textarea opinion" id="opinion" v-model="opinion" name="opinion" placeholder="请输入意见内容" rows="2"></textarea>
          </div>
        </div>
      </form>
    </div>
    <div id="bmlogs">
      <SalesOperationLogs7 :nodeid="nodeid" :orderid="id" :srguid="baseInfo.srguid" :departid="baseInfo.departid" :flowid="flowid"></SalesOperationLogs7>
    </div>
    <ApproveBom v-if="isReady" type="purchaseFdRm" :flowid="flowid" :nodeid="nodeid" :id="id" :srguid="baseInfo.srguid" :departid="baseInfo.departid" :model="baseInfo" :opinion="opinion" :fileids="fileids" :refuseflag="refuseflag" :annex="annex" passUrl="/prod-api/purchasebill/purchasebill/transferIn" refuseUrl="/prod-api/purchasebill/purchasebill/refuse" navgateUrl="/purchase2/PurchaseList" ></ApproveBom>
  </div>
</template>

<script>
  import wx from 'weixin-js-sdk';
  import SalesOperationLogs7 from '@/components/common/SalesOperationLogs7'
  import ApproveBom from '@/components/common/ApproveBom'
  import UploadFile3 from "../common/UploadFile3";

  export default {
    name: 'Examine26',
    data () {
      return {
        flowid: 26,
        opinion: '',
        openid: localStorage.openid,
        id: '',
        title: '',
        nodeid: '',
        annex: '',
        baseInfo: {},
        baseItems: '',
        wxParams: {},
        images: {
          serverId: [],
          srcStr: [],
        },
        refuseflag: '',
        refuseNodes: [],
        orderfiles: [],
        isReady: false,
        filenames: [],
        fileids: [],
        houses: [],
      }
    },
    components: {
      SalesOperationLogs7,
      ApproveBom,
      UploadFile3
    },
    mounted () {
      //提交操作定位到页面底部
      //$('#bmlogs').css('margin-bottom', this.$refs.actHtml.offsetHeight)

      //$('#opinion').focus();
      this.id = this.$route.query.id;
      this.nodeid = this.$route.query.nodeid;
      this.annex = this.$route.query.annex;
      this.title = this.$route.query.title;
      this.refuseflag = this.$route.query.refuseflag;

      this.getBaseInfo(this.id);
      if (this.$route.query.status) {
        this.status = this.$route.query.status;
      }
    },
    methods: {
      delItem: function(guid) {
        const that = this;
        $.confirm('确定要删除？', function () {
          that.baseInfo.items = that.baseInfo.items.filter(item => item.guid != guid);
        })
      },
      delFile: function (name, id) {
        let that = this;
        $.confirm('确定要删除？', function () {
          that.axios({
            method: 'post',
            url: '/prod-api/common/delete',
            params: {id: id}
          })
          that.fileids = that.fileids.filter(item => {
            return item != id;
          })
          that.filenames = that.filenames.filter(item => {
            return item != name;
          })
        })
      },
      setFile: function (file) {
        this.filenames.push(file.name);
        this.fileids.push(file.id);
      },
      packUnit: function(unit, currency) {
        return unit != undefined && unit != '' ? currency == 2 ? '美元/' + unit : '元/' + unit : '';
      },
      checkCore:function() {
        var u = navigator.userAgent;
        //var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1;//g
        var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);   //ios终端
        if (isIOS) {
          return 'ios';
        } else  {
          return 'android';
        }
      },
      autoHouses: function(no) {
        return this.houses['house' + no];
      },
      getBaseInfo: function (id) {
        this.axios({
          method: 'get',
          url: `/prod-api/purchasebill/purchasebill/${id}`,
        }).then(response => {
          if (response.data.code == 200) {
            let data = response.data;
            this.baseInfo = data.data || {};
            //获取库间
            if (this.baseInfo.items.length != 0) {
              for (let i=0; i<this.baseInfo.items.length; i++) {
                this.getHouses(this.baseInfo.strmId, this.baseInfo.items[i].type, i);
              }
            }
            // this.baseItems = response.data.items;
          } else if (response != undefined && response.data != undefined && response.data.msg == 'sessionTimeOut') {
            //不不设置提示
          } else {
            this.toastError('系统错误');
          }
          this.isReady = true;
        });
      },
      getHouses: function(roomid, type, index) {
        this.axios({
          method: 'get',
          url: '/prod-api/getStoreHouseRoomByRoomId',
          params: {id: roomid, type: type}
        }).then((response) => {
          if (response.data.code == 200) {
            let data = response.data;
            this.$set(this.houses, 'house' + index, data.data);
            //this['house' + index] = data.houses;
          } else if (response.data.msg) {
            this.toastText(response.data.msg);
          } else {
            this.toastText("获取库间数据失败");
          }

        })
      },


    }
  }
</script>
